import React, {lazy, Suspense, useEffect} from 'react'
import LoadingOrError from './components/LoadingOrError'
import './App.css'
// 引入路由组件
import { Switch, Route, BrowserRouter } from 'react-router-dom'

// 引入主要页面
const Shouye = lazy(async () => import("./pages/shouye"))

function App() {
    // 向外层网页请求token等用户信息
    const getuserinfo = () => {
        window.parent.postMessage("我要用户数据", '*');
    }
    const gettoken=(event)=>{
        console.log("从上层获得的数据",event)
    }
    // 初始化的时候获取用户信息，存储到redux里面，销毁的时候，取消监听。
    useEffect(()=>{
        getuserinfo()
        window.addEventListener("sendtoken",gettoken)
        return ()=>{
            window.removeEventListener("sendtoken",gettoken)
        }
    },[])
  return (

      <BrowserRouter>
        <Suspense fallback={<LoadingOrError />}>
          <Switch>
            <Route path="/" component={Shouye} />
          </Switch>
        </Suspense>
      </BrowserRouter>

  )
}

export default App
